<template>
	<mescroll-body ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback">
		<view class="notice">
			<view class="item" v-for="(item, index) in noticeList" :key="index" @click="toNoticeDetail(item)">
 				<view class="item__title">
					<view class="title">{{item.title}}</view>
					<view>{{item.virtual_at}}</view>
				</view>
				<view class="item__content">{{item.desc}}</view>
			</view>
		</view>
	</mescroll-body>
</template>

<script>
	import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
	export default {
		mixins: [MescrollMixin],
		data() {
			return {
				noticeList: [],
				page: 1
			};
		},
		onLoad() {
			this.getNoticeList();
		},
		methods: {
			// 获取公告列表
			getNoticeList() {
				this.$api.get('/addons/yun_shop/api.php?i=4&type=5&route=plugin.article.api.article.get-articles&category_id=0', {
					page: 1
				}).then(res => {
					this.noticeList = res.data.articles.data
					console.log(this.noticeList);
				})
			},
			// 去详情
			toNoticeDetail (item) {
				uni.navigateTo({
					url: '/pages/index/notice-list/notice-detail?id='+item.id
				})
			},
			// 下拉刷新列表
			downCallback() {
				this.mescroll.resetUpScroll(); // 重置列表为第一页 (自动执行 page.num=1, 再触发upCallback方法 )
			},
			/*上拉加载的回调*/
			async upCallback(page) {
				this.page = page.num;
				let apiUrl = `/addons/yun_shop/api.php?i=4&type=5&route=plugin.article.api.article.get-articles&category_id=0`
				this.$api.get(apiUrl, { page: this.page }).then(res => {
					let len = res.data.articles.data.length
					let total = res.data.articles.total
					if (page.num == 1) {
						this.noticeList = []; //如果是第一页需手动置空列表
					}
					this.noticeList = this.noticeList.concat(res.data.articles.data); //追加新数据
					this.mescroll.endBySize(len, total);
				})
			},
		}
	}
</script>

<style scoped lang="scss">
	@import './notice-list.scss';
	.full-image {
		img {
			width: 100%;
		}
	}
</style>
